'use strict';

//webpack将会是趋势，gulp已过时
//载入gulp核心包
const gulp = require('gulp');

//gulp是用来帮我们执行一些重复操作的，
// 一般我们将这些重复操作划分为不同的任务


//如何定义一个任务
//第一个参数是任务名，第二个参数是任务执行体
gulp.task('hello',function () {
    console.log('hello itcast');
//    这里编写一些重复性的流程

//
});

//让任务进行还是命令行

//最常见的一些流程包括：
//拷贝文件
gulp.task('dest',function () {
    //获取文件
    //glob匹配语法：https://www.gulpjs.com.cn/docs/getting-started/explaining-globs/
    //['src/**/*.*','src2/*.*','!src/demo.html']
    gulp.src('src/**/*.*').pipe(
        //让文件流走向下一个环节，整个过程可以链式编程
        //管道：文件拿出来后，顺着管道往下流；
        // 可以传入一些处理函数；
        // 这些函数可能对文件进行压缩、编码、目标的存放等操作
        //采用链式操作
        gulp.dest('dist/')
    );
});

//default:默认任务
//执行:gulp或者gulp default
gulp.task('default',function () {
    console.log('这是默认任务');
    //watch:监视某些文件，当文件发生变化时执行一系列任务
    //当sec目录下的文件发生变化时，自动执行后面的任务
    gulp.watch('src/*',['dest']);
});


//gulp 原本不支持任何功能，只提供最基础API

//常用插件
//编译less: gulp-less
//编译Jade: gulp-jade
//创建本地服务器: gulp-connect
// 实时预览
//合并文件:gulp-concat
//最小化js文件: gulp-uglify
//重命名文件: gulp-rename
//最小化css文件: gulp-minify-css
//压缩html文件 gulp-minify-html
//最小化图像: gulp-imagemin


//插件使用过程
//先有一个需求
//根据需求找到对应插件  https://npm.best
//找到这插件的官方地址  如https://www.npmjs.com/package/gulp-less，https://github.com/gulp-community/gulp-less
//根据官方地址中的基本使用，做一个简单demo

//gulp-less
const less = require('gulp-less');

gulp.task('style',function () {
    gulp.src('src/**/*.less')
        //让less转换为css
        //gulp-less插件
        .pipe(less())
        .pipe(gulp.dest('dist/'));

})

gulp.task('watch',function () {
    gulp.watch('src/**/*.less',['style']);
})

//定义一个HTTP服务器
//会自己创建一个8080端口的服务程序，不需要tomcat或者jetty
const connect = require('gulp-connect');

gulp.task('serve',function () {
    //创建一个服务器，默认监听8080端口
    connect.server({
        root: 'public',
        livereload: true
    });

    gulp.watch('public/**/*.*',['reload']);
})

gulp.task('reload',function () {
    gulp.src('public/**/*.*')
        .pipe(connect.reload());
})

// gulp 不再支持同步任务（Synchronous tasks）
// gulp 不再支持同步任务（Synchronous tasks）了。
// 因为同步任务常常会导致难以调试的细微错误，例如忘记从任务（task）中返回 stream。

// 当你看到 "Did you forget to signal async completion?" 警告时，说明你并未使用前面提到的返回方式。
// 你需要使用 callback 或返回 stream、promise、event emitter、child process、observable 来解决此问题。


// const { series, parallel } = require('gulp');
//
// function clean(cb) {
//     // body omitted
//     cb();
// }
//
// function css(cb) {
//     // body omitted
//     cb();
// }
//
// function javascript(cb) {
//     // body omitted
//     cb();
// }
//
// exports.build = series(clean, parallel(css, javascript));
//
// function  cb() {
//     console.log('cb');
// }





// This is INCORRECT
// const { series, parallel } = require('gulp');
//
// const clean = function(cb) {
//     // body omitted
//     cb();
// };
//
// const css = series(clean, function(cb) {
//     // body omitted
//     cb();
// });
//
// const javascript = series(clean, function(cb) {
//     // body omitted
//     cb();
// });
//
// exports.build = parallel(css, javascript);